<template>
    <div class="container">
        <p>待处理事务</p>
        <ul>
            <li>采购待审核
                <span>4</span>
            </li>
            <li>采购退货待审核</li>
            <li>入库待审核</li>
            <li>出库待审核
                <span>1</span>
            </li>
            <li>凋拔待审核
                <span>1</span>
            </li>
            <li>盘点待审核</li>
            <li>订单促销待审核</li>
            <li>商品促销待审核</li>
            <li>—— ——</li>
        </ul>
    </div>
</template>

<script>
export default {
    
}
</script>

<style lang="scss" scoped>
.container{
    width: 510px;
    margin: 0 auto;
    p{
        line-height: 45px;
        padding-left: 10px;
        box-sizing: border-box;
        font-size: 13px;
        color: #333;
        margin: 0;
        font-weight: 700;
        font-style: '微软雅黑';
    }
    ul{
        display: flex;
        flex-flow: wrap;
        padding: 0;
        li{
            width: 33.3%;
            height: 40px;
            box-sizing: border-box;
            padding-left: 20px;
            font-size: 12px;
            color: #333;
            list-style: none;
            span{
                display: inline-block;
                width: 20px;
                line-height: 20px;
                background: inherit;
                background-color: rgba(255, 0, 0, 1);
                border: none;
                border-radius: 50%;
                box-shadow: none;
                font-family: '微软雅黑';
                font-style: normal;
                font-size: 10px;
                color: #FFFFFF;
                text-align: center;
            }
        }
    }
}
</style>